<div id="page-wrapper" class="animated marg220">
<div class="page-t">
  <div class="page-nav">
    <a  href="javascript:;">设备管理</a>
    <a  routerLinkActive="active" >设备信息</a>
  </div>
  <router-outlet></router-outlet>
  <div class="search-box">
    <span class="xt-search">
               <input #searchBox type="text" id="search-box"  class="form-box"
                      placeholder="请输入设备号">
           <button class="btn-red btns" (click)="search2(searchBox.value)" type="submit">搜索</button>
  <!--<span>-->
          <!--<span *ngFor="let menu of menus | async"-->
                <!--(click)="gotoDetail(menu)" class="search-result"  > {{menu.menuTitle}}</span>-->
        <!--</span>-->
   </span>

    <!--<button (click)="tjmenu=true; clicked=true;tjmenuform.reset();" class="btn-blue btns" type="button">+添加设备</button>-->
  </div>

</div>
<div class="J_mainContent" id="content-main">
  <div class="wrapper wrapper-content">
    <!--<track-map></track-map>-->
    <div class="xt-list">
      <table class="table table-striped">
        <thead>
        <tr>
          <th >
            序号
          </th>
          <th>
            设备号
          </th>
          <th>
            设备使用者
          </th>
          <th>
          设备绑定手机号
          </th>
          <th>
            定位频率
          </th>
          <th>
            紧急联系人
          </th>
          <!--<th>-->
            <!--电子围栏-->
          <!--</th>-->
          <!--<th>-->
            <!--操作-->
          <!--</th>-->
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let device of devices; let i = index;"  (click)="onSelect(device)">
          <td>{{(curPage-1)*10+i+1}}</td>
          <!--<td>{{electricity.locationType}}</td>-->
          <td >{{device.deviceImei}}</td>
          <td >{{device.deviceUserName}}</td>
          <td>{{device.devicePhone}}</td>
          <td>{{device.timeInterval}}</td>
          <td>{{device.familyPhones}}</td>
          <!--<td>{{device.railName}}<span *ngIf="device.railName">：{{device.parameter}}</span><span *ngIf="!device.railName">无</span></td>-->
          <!--<td>&nbsp;&nbsp;-->
            <!--<a  (click)="deletemenu=true; clicked=true;device === selectedDevice" >修改</a>&nbsp;&nbsp;&nbsp;&nbsp;-->
            <!--<a (click)="delete(device.deviceImeiCode); $event.stopPropagation()">删除</a>-->
          <!--</td>-->
        </tr>
        </tbody>
      </table>

    </div>
    <div style="position:relative;padding:0 30px;top:0">
      <!--分页组件-->
      <div class="col-md-12 text-right margin-bottom mt25" *ngIf="devices&&!isSearch">
        <a class="pull-left text-sm wordHei">总计 {{totalNum}} 条，第 {{curPage}} / {{totalPage}} 页</a>

        <button class="btn btn-default next"  (click)="changePage(curPage-1)"
                [disabled]="curPage==1">上一页</button>
        <button class="btn btn-default"   [ngClass]="x.isActive?'btn-primary':'btn-oprate'"
                (click)="changePage(x.pageNum)"  *ngFor="let x of pageList;let i = index;">
          {{x.pageNum}}
        </button>
        <button class="btn btn-default next"  (click)="changePage(curPage+1)"
                [disabled]="curPage==totalPage">下一页</button>
      </div>
      <div class="col-md-12 text-center text-sm text-dark-gray mt10" *ngIf="isEmpty">
        没有查询到数据
      </div>
    </div>
  </div>
</div>
</div>
<!--<div [hidden]="!clicked"  class="mask"></div>-->


<!--<div [hidden]="!tjmenu"  class="operate menu">-->
  <!--<form class="operate-form"  #tjmenuform="ngForm" (ngSubmit)="tjmenuform.form.valid && add(deviceImeiCode.value,deviceUser.value,deviceMobile.value,-->
        <!--deviceMobile1.value,deviceMobile2.value,address.value,deviceCreateTime.value);">-->
    <!--<div class="operate-title">添加设备<span (click)="clicked=false; tjmenu=false;" class="fa fa-close"></span></div>-->
    <!--<div class="operate-content pb15">-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备号:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceImeiCode" name="deviceImeiCode" class="form-box"  [(ngModel)]="Device.deviceImeiCode" #deviceImeiCode="ngModel">-->
          <!--<p *ngIf="tjmenuform.submitted && !deviceImeiCode.valid"   class="text-danger">设备号不能为空</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备使用者:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceUser" name="deviceUser" class="form-box"  [(ngModel)]="Device.deviceUser" #deviceUser="ngModel">-->
          <!--<p *ngIf="tjmenuform.submitted && !deviceUser.valid"   class="text-danger">设备使用者不能为空</p>-->
        <!--</div>-->
      <!--</div>-->

      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备绑定手机号:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="deviceMobile" name="deviceMobile" class="form-box"  [(ngModel)]="Device.deviceMobile"-->
                 <!--#deviceMobile="ngModel" pattern="^1[3|4|5|8][0-9]\d{4,8}$">-->
          <!--<p *ngIf="tjmenuform.submitted && !deviceMobile.value"   class="text-danger">电话不能为空</p>-->
          <!--<p class="text-danger" *ngIf="deviceMobile.errors?.pattern && deviceMobile.touched">手机号码格式不正确</p>-->
        <!--</div>-->
      <!--</div>-->

      <!--<div class="operate-item fn-clear">-->
        <!--<label>紧急联系人1:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="deviceMobile1" name="deviceMobile1" class="form-box" [(ngModel)]="Device.deviceMobile1" #deviceMobile1="ngModel">-->
          <!--<p *ngIf="tjmenuform.submitted && !deviceMobile1.valid"   class="text-danger">至少填写一位紧急联系人</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>紧急联系人2:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceMobile2" name="deviceMobile2" class="form-box" [(ngModel)]="Device.deviceMobile2" #deviceMobile2="ngModel">-->
          <!--&lt;!&ndash;<p *ngIf="tjmenuform.submitted && !deviceMobile2.valid"   class="text-danger">定位间隔不能为空</p>&ndash;&gt;-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>家庭住址:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="address" name="address" class="form-box" [(ngModel)]="Device.address" #address="ngModel">-->
          <!--<p *ngIf="tjmenuform.submitted && !address.valid"   class="text-danger">家庭住址不能为空</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label class="unmust">设备创建时间:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required   type="text"  id="deviceCreateTime" name="deviceCreateTime" class="form-box"  [(ngModel)]="Device.deviceCreateTime" #deviceCreateTime="ngModel">-->
          <!--&lt;!&ndash;<p [hidden]="coding.pristine || coding.valid"  class="text-danger sbd">编号不能为空</p>&ndash;&gt;-->
        <!--</div>-->
      <!--</div>-->

      <!--<div class="operate-btn mt15">-->
        <!--<button type="submit"     class="btns btn-blue">保存</button>-->
        <!--<button (click)="tjmenu=false; clicked=false;" type="reset" class="btns btn-gray">取消</button>-->
      <!--</div>-->
    <!--</div>-->
  <!--</form>-->
<!--</div>-->

<!--<div [hidden]="!deletemenu"  class="operate menu"  *ngIf="selectedDevice">-->
  <!--<form class="operate-form"  #deletemenuform="ngForm" (ngSubmit)="deletemenuform.form.valid && save();">-->
    <!--<div class="operate-title">修改设备<span (click)="clicked=false; deletemenu=false;" class="fa fa-close"></span></div>-->
    <!--<div class="operate-content">-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备号:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceImeiCode2" name="deviceImeiCode2" class="form-box"  [(ngModel)]="selectedDevice.deviceImeiCode" #deviceImeiCode2="ngModel">-->
          <!--<p *ngIf="deletemenuform.submitted && !deviceImeiCode2.valid"   class="text-danger">设备号不能为空</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备使用者:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceUser2" name="deviceUser2" class="form-box"  [(ngModel)]="selectedDevice.deviceUser" #deviceUser2="ngModel">-->
          <!--<p *ngIf="deletemenuform.submitted && !deviceUser2.valid"   class="text-danger">设备使用者不能为空</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备绑定手机号:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="deviceMobile" name="deviceMobile2" class="form-box" [rangeLength]="[8, 13]" [(ngModel)]="selectedDevice.deviceMobile"-->
                 <!--#deviceMobile2="ngModel" pattern="^1[3|4|5|8][0-9]\d{4,8}$">-->
          <!--<p *ngIf="deletemenuform.submitted && !deviceMobile2.value"   class="text-danger">设备手机号不能为空</p>-->
          <!--<p class="text-danger" *ngIf="deviceMobile2.errors?.pattern && deviceMobile2.touched">手机号码格式不正确</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>紧急联系人1:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="deviceMobile3" name="deviceMobile3" class="form-box" [(ngModel)]="selectedDevice.deviceMobile1" #deviceMobile3="ngModel">-->
          <!--<p *ngIf="deletemenuform.submitted && !deviceMobile3.valid"   class="text-danger">至少填写一位紧急联系人</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>紧急联系人2:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="text"  id="deviceMobile4" name="deviceMobile4" class="form-box" [(ngModel)]="selectedDevice.deviceMobile2" #deviceMobile4>-->
          <!--&lt;!&ndash;<p *ngIf="tjmenuform.submitted && !deviceMobile2.valid"   class="text-danger">定位间隔不能为空</p>&ndash;&gt;-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>家庭住址:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required  type="number"  id="address2" name="address2" class="form-box" [(ngModel)]="selectedDevice.address" #address2="ngModel">-->
          <!--<p *ngIf="deletemenuform.submitted && !address2.valid"   class="text-danger">家庭住址不能为空</p>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="operate-item fn-clear">-->
        <!--<label>设备创建时间:</label>-->
        <!--<div class="operate-group">-->
          <!--<input required   type="text"  id="deviceCreateTime2" name="deviceCreateTime2" class="form-box"  [(ngModel)]="selectedDevice.deviceCreateTime" #deviceCreateTime2="ngModel">-->
          <!--&lt;!&ndash;<p [hidden]="coding.pristine || coding.valid"  class="text-danger sbd">地址不能为空</p>&ndash;&gt;-->
        <!--</div>-->
      <!--</div>-->

      <!--<div class="operate-btn">-->
        <!--<button type="submit"     class="btns btn-blue">保存</button>-->
        <!--<button (click)="deletemenu=false; clicked=false;" type="reset" class="btns btn-gray">取消</button>-->
      <!--</div>-->
    <!--</div>-->
  <!--</form>-->
<!--</div>-->
